import React, { useEffect } from "react";
import { NoData } from "@ct0/ui";

export default function NoDataPanel() {
  return (
    <div>
      <h2>NoData 空数据</h2>
      <ul>
        <li>提供空数据时的页面展示</li>
      </ul>
      <h2>代码演示</h2>
      <div
        style={{
          width: "100%",
          height: "300px",
          borderRadius: "4px",
          boxShadow: "0 0 4px 0 #d5dbe2",
        }}
      >
        <NoData />
      </div>
      <div className="code" style={{ marginTop: "10px" }}>
        <pre>
          <code className="language-jsx">
            {`import { NoData } from '@ct0/ui'`} {"\n"}
            {"const Demo = () => (<div className='warp'><NoData /></div>)"}{" "}
            {"\n"}
            {`ReactDOM.render(<Demo />,mountNode)`}
          </code>
        </pre>
      </div>
    </div>
  );
}
